<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>流程图</title>
    <link rel="stylesheet" href="font-awesome-4.7.0/css/font-awesome.min.css">
    <link href="css.css" rel="stylesheet">
    <script src="jquery-1.8.0.min.js"></script>
</head>
<body>
    <div class="window-content">
        <p class="window-content-title"><img src="images/title.png" style="display: inline"><span>wfs办理业务</span><i class="fa fa-close"></i></p>
        <div class="window-content-box">
            <div class="content-title">
                <div class="li_div_div_FlowTemplateTitle">
                    <span class="title-name">
                        <img src="images/flow.png" style="display: inline;padding-right: 5px;vertical-align: text-top;">
                        <span>流程名称</span>
                    </span>
                    <span>Word转换测试-设置部分活动人员</span>
                    <div class="title-button">
                        <input value="同意" type="button">
                        <input value="不同意" type="button">
                    </div>
                </div>

            </div>
            <div class="content-tab">
                <ul>
                    <li class="on">审批资料</li>
                    <li>流程审批图</li>
                </ul>
            </div>
            <div class="tab-content">
                <div class="con show" style="width: 1000px;height: 1000px">审批资料的内容</div>
                <div class="con">流程审批图的内容</div>
            </div>
            <div class="opinion">
                <p class="window-content-title"><img src="images/opinion.png" style="display: inline"><span>审批意见</span></p>
                <div class="opinion-content">
                    <ul>
                        <li>
                            <div class="li-opinion">
                                <p class="window-content-title"><span style="font-weight: normal;font-size: 12px;padding-left: 0">审批人：user001</span></p>
                                <div class="li-opinion-content" style="overflow: hidden">
                                    <span class="yijian">审批意见：</span>

                                </div>
                                <p class="window-content-title" style="border-bottom: 0;border-top: 1px solid #ddd"><span style="font-weight: normal;font-size: 12px;padding-left: 0">审批时间：2017-11-15 17:39</span></p>
                            </div>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
        <!--关闭按钮-->
        <p class="window-content-foot"><i class="fa fa-close"></i><span>关闭</span></p>
    </div>
<script>
    $(function () {
        $(".content-tab ul li").on("click",function () {
            $(this).addClass("on").siblings().removeClass("on");
            var index = $(this).index();
            $(".con").eq(index).fadeIn().addClass("show").siblings().removeClass("show").hide();
            return false;
        })
    })
</script>
</body>
</html>